<template>
    <div class="home-contain">
        <V-Header @refurbished="refurbished" @seacherData="seacherData"></V-Header>
        <div class="el-main">
           <list-item  v-for="(item,index) of resultList" :key="item.questionId" :item="item" @click.native="goDateil(item.questionId)" @refurbished="refurbished" ></list-item>
        </div>
    </div>
</template>

<script>
import VHeader from "@/components/header";
import listItem from "@/components/listItem";
import { mapState, mapMutations } from 'vuex'
// import axios from 'axios'
export default {
  name: "home",
  data() {
    return {
      resultList:[]
    };
  },
  computed:{
      ...mapState({
          isLogin:'isLogin',
          isAdmin:'isAdmin'
      })
  },
  methods:{
        goDateil(id){
          if(this.isLogin){
             this.$router.push({name:'details',params:{questionId: id}});
          }else{
              this.$confirm('是否现在去登录?', '未登录', {
                confirmButtonText: '登录 / 注册',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                  this.$router.push("login");
                }).catch(() => {
                          
                });
            }
        },
        getHomeData(){
           this.axios.get('/homeApl/question/all')
            .then( (response) => {
                if(response.data.code == 0){
                   this.resultList = response.data.result;
                   this.changeRole();
                   this.changeName(localStorage.username);
                }
            })
            .catch( (error) => {
                console.log(error);
            });
        },
        refurbished(){
           this.getHomeData()
        },
        seacherData(seaData){
          this.resultList = seaData;
        },
        ...mapMutations(["changeRole",'changeName'])
  },
  mounted () {
     this.getHomeData()
  },
  components: {
    VHeader,
    listItem
  }
};
</script>

<style scoped lang='scss'>
.home-contain {
  .el-main {
    margin: 70px auto;
    width: 1000px;
    // height: 3000px;
    padding: 0;
    
  }
}
</style>